<template>
	<view class="container1"><!--报警信息-->
		<template v-for='item in list'>
			<view class="itemday">{{item.day}}</view>
			<view v-for="item1 in item.list" class="alarm" @click="alarmDetail(item1)">
				<view class="alarmBq">
					
					<view class="alarmBqLeft">
						<image src="@/static/images/decList.png"></image>
						<view>
							<view>No.{{item1.serial_number}}</view>
							<view class="alarType">{{item1.notification_name}}</view>
						</view>
					</view>
					<view @click="del(item1)">{{item1.time}}</view>
				</view>
				<view class="alarmInfo"><text>报警人：</text>{{item1.object_name}}</view>
				<view class="alarmInfo"><text>报警位置：</text>{{item1.address}}</view>
				
			</view>
			
		</template>
		
		<view v-if="list.length<=0" style="padding-top:100rpx;">
			<u-empty></u-empty>
		</view>
		
		<view style="padding-top:10px;" v-if="list.length>0"><u-loadmore :status="status"   /></view>
		
		<tabbar :current="current"></tabbar>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				current:2,
				list:[],
				total:0,
				status:'loading',
				pageSize:20,
				pageNum:1,
				id:undefined
			}
		},
			onReachBottom(){
				this.getList();
			},
			onLoad(e) {
				if(e.id && e.id != "undefined"){
				console.log(e.id)
						this.id=e.id;
				}
			
				this.getList()
			},
		methods: {
			
			del(){
				
			},
			alarmDetail(item){
				console.log(item)
				uni.navigateTo({
					url: `/pages/alarm/alarmDetail?id=${item.id}&deviceId=${this.id}`,
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			},
			getList(){
				
					
					// imei
					let data={
						pageSize:this.pageSize,
						pageNumber:this.pageNum,
					}
					if(this.id){
						data.imei = this.id;
					}
					if(this.total != 0){//加载完成后
						if(this.total == this.pageNum){
							return;
						}	
					}
					this.status ='loading';
					this.$http.alarmList(data).then(res=>{
						// this.list = res.page.records;
						if(res.code==0){
							this.status ='nomore';
							this.total=res.page.total;
							for(let i in res.page.records){
								this.list.push(res.page.records[i])
							}
							if(this.list.pageNum >= this.total){
								this.status ='nomore';
							}else{
								this.status ='loadmore';
							}
							this.pageNum++;
						}
					
						
					})
				
				
				}
			
			
			
			
		}
	}
</script>


<style scoped>
	.container1{padding:0 30rpx;font-size:24rpx;}
	.itemday{padding:20rpx 0 0 10rpx; }
	.alarm{background:#fff;border-radius: 10rpx;margin-top:20rpx;padding:30rpx 30rpx;}
	.alarmInfo{padding-top:14rpx;}
	.alarmInfo text{font-weight: bold;}
	.alarmBq{border-bottom:1rpx solid #e7e7e7;display: flex;padding-bottom: 10rpx; justify-content: space-between;}
	.alarType{font-size:30rpx;color:#b14425;padding-top:6rpx;}
	.alarmBqLeft{
		display: flex;
		align-items: center;
		margin-bottom: 10rpx;
	}
	.alarmBqLeft image{width:90rpx;height: 90rpx;margin-right:20rpx;}
	
</style>

